<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>医院排队叫号系统</title>
    <jsp:include page="include/mangerheadtag.jsp"/>

</head>
<body>
<jsp:include page="include/head.jsp"/>
<jsp:include page="include/menu.jsp"/>

<div id="page-inner">
    <c:if test="${requestScope.message!=null}">
        <script>
            $(function () {
                alert("${requestScope.message}");
            })
        </script>
        ${requestScope.remove("message")}
    </c:if>

<div style="margin-top: 100px;margin-left: 300px">
    <div class="search">
    <h1>医生列表</h1>
    <form id="office" action="<c:url value="/SearchDoctorServlet"/>" method="post">
        <input  value="" name="DoctorName"  autocomplete="off" class="" placeholder="医生名称">
        <input type="hidden" name="action" value="Search_Doctor">
        <button type="submit" class="">查找医生</button>
    </form>
        <style>
            .search{
                height:150px;
                border-bottom: 2px #2e2e2e solid;
            }
            .search input {
                height: 40px;
                width: 200px;
                color: #2e2e2e;
                padding: 0 20px;
                border-radius: 4px;
            }

            .search button{
                height: 40px;
                color: #2e2e2e;
                padding: 0 20px;
                border-radius: 2px;
                cursor: pointer;
            }
            .search button:hover{
                color: #0065AF;
            }
        </style>
    </div>


    <c:if test="${requestScope.doctors!=null}">
            <c:forEach items="${requestScope.doctors}" var="doctor">
                        <div class="ysjs">
                            <div class="title">
                                <div class="t">
                                    <span>${doctor.dname}</span>
                                    <span class="gender">${doctor.gender}</span>
                                    <span class="career">${doctor.career}</span>
                                    <span class="career">${doctor.age}岁</span>
                                </div>
                                <div class="b">
                                    <span>${doctor.office} </span> <span>出诊费：${doctor.fee}</span>
                                </div>
                                <img src="${doctor.picpath}">
                            </div>
                            <div class="content">
                                <div >
                                    <div>介绍：</div>
                                    <div>${doctor.description}</div>
                                    <div>擅长：</div>
                                    <div>${doctor.ability}</div>
                                </div>
                            </div>
                        </div>
            </c:forEach>
        ${requestScope.remove("doctors")}
    </c:if>


    <c:if test="${requestScope.doctor!=null}">
        <div class="ysjs">
            <div class="title">
                <div class="t">
                    <span>${requestScope.doctor.dname}</span>
                    <span class="gender">${requestScope.doctor.gender}</span>
                    <span class="career">${requestScope.doctor.career}</span>
                    <span class="career">${requestScope.doctor.age}岁</span>
                </div>
                <div class="b">
                    <span>${requestScope.doctor.office} </span> <span>出诊费：${requestScope.doctor.fee}</span>
                </div>
                <img src="${requestScope.doctor.picpath}">
            </div>
            <div class="content">
                <div >
                    <div>介绍：</div>
                    <div>${requestScope.doctor.description}</div>
                    <div>擅长：</div>
                    <div>${requestScope.doctor.ability}</div>
                </div>
            </div>
        </div>

    </c:if>

            <style>
                .ysjs{
                    margin: 20px;
                    border-radius: 8px;
                    width: 680px;
                    border: 1px #000 solid;
                }
                .ysjs .title{
                    margin: 20px;
                    position: relative;
                }
                .ysjs .title:after{
                    visibility: hidden;
                    display: block;
                    font-size: 0;
                    content: "";
                    clear: both;
                    height: 0;
                }
                .ysjs .title .t span{
                    margin: 20px;
                    color: black;
                    font-size: 30px;
                    line-height: 30px;
                }
                .ysjs .title .b span{
                    margin-left: 20px;
                    color: black;
                    font-size: 20px;
                    line-height: 30px;
                }
                .ysjs .title img{
                    position: absolute;
                    top: -20px;
                    left: 480px;
                    width: 100px;
                    height: 125px;
                }
                .ysjs .title .t .gender{
                    color:black;
                }
                .ysjs .title .t .career{
                    font-size: 17px;
                    margin-left: 30px;
                    color:black;
                }
                .ysjs .content {
                    border-top: 1px solid rgb(219, 219, 219);
                    margin: 30px;
                    text-align: left;
                    width: 640px;
                }
                .ysjs .content div{
                    padding-top: 10px;
                }
            </style>
        </div>


</body>
</html>
